import {defineStore} from 'pinia';
import {store} from '@/store';
import zhCn from 'element-plus/es/locale/lang/zh-cn';
import en from 'element-plus/es/locale/lang/en';
import {useCache} from '@/hooks/web/useCache';
import CacheKeys from '@/constants/CacheKeys';
import {LocaleDropdownType} from '@/types/localeDropdown';

const {wsCache} = useCache();

const elLocaleMap = {
    'zh-CN': zhCn,
    en: en,
};

interface LocaleState {
    currentLocale: LocaleDropdownType;
    localeMap: LocaleDropdownType[];
}

export const useLocaleStore = defineStore('locales', {
    state: (): LocaleState => {
        return {
            currentLocale: {
                lang: wsCache.get(CacheKeys.SYS_LANG) || 'zh-CN',
                elLocale: elLocaleMap[wsCache.get(CacheKeys.SYS_LANG) || 'zh-CN'],
            },
            // 多语言
            localeMap: [
                {
                    lang: 'zh-CN',
                    name: '简体中文',
                },
                {
                    lang: 'en',
                    name: 'English',
                },
            ],
        };
    },
    getters: {
        getCurrentLocale(): LocaleDropdownType {
            return this.currentLocale;
        },
        getLocaleMap(): LocaleDropdownType[] {
            return this.localeMap;
        },
    },
    actions: {
        setCurrentLocale(localeMap: LocaleDropdownType) {
            // this.locale = Object.assign(this.locale, localeMap)
            this.currentLocale.lang = localeMap?.lang;
            this.currentLocale.elLocale = elLocaleMap[localeMap?.lang];
            wsCache.set(CacheKeys.SYS_LANG, localeMap?.lang);
        },
    },
});

export const useLocaleStoreWithOut = () => {
    return useLocaleStore(store);
};
